<div class="navbar navbar-default" id="navbar">
    <div class="navbar-container" id="navbar-container">
        <div class="navbar-header pull-left">
            <a href="#" class="navbar-brand">
                <small>
                    <i class="icon-leaf"></i> Newer信息系统
                </small>
            </a>
        </div>
        <!-- /.navbar-header -->
        <div class="navbar-header pull-right" role="navigation">
            <ul class="nav ace-nav">
                <li class="light-blue">
                    <a data-toggle="dropdown" href="#"
                       class="dropdown-toggle">
                        <img class="nav-user-photo" src="avatars/avatar2.png" alt=""/>
                        <span class="user-info">
                            <small>欢迎光临,</small><@shiro.principal property="loginName" />
					    </span>
                        <i class="icon-caret-down"></i>
                    </a>
                    <ul class="user-menu pull-right dropdown-menu dropdown-yellow dropdown-caret dropdown-close">
                        <li>
                            <a href="#" data-toggle="modal" data-target="#usePwdModal">
                                <i class="icon-cog"></i>重置密码
                            </a>
                        </li>
                        <li class="divider"></li>
                        <li>
                            <a href="${request.contextPath}/logout.do"> <i class="icon-off"></i>
                                退出
                            </a>
                        </li>
                    </ul>
                </li>
            </ul>
            <!-- /.ace-nav -->
        </div>
        <!-- /.navbar-header -->
    </div>
    <!-- /.container -->
</div>

<!-- 弹出模态窗口-->
<div class="modal fade" tabindex="-1" role="dialog" id="usePwdModal">
    <div class="modal-dialog">
        <div class="modal-content">
            <!-- 密码修改模态窗 -->
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title">密码修改</h4>
            </div>
            <div class="modal-body">
                <div class="page-content">
                    <div class="table-responsive page-content">
                        <form class="form-horizontal" role="form" id="user-restpwd-form">
                            <input type="hidden" name="id" id="id" value="<@shiro.principal property="id" />">
                            <div class="form-group">
                                <label class="col-sm-3 control-label no-padding-right" for="loginPwd">
                                    密码
                                </label>
                                <div class="col-sm-9">
                                    <input type="password" id="loginPwd" name="loginPwd"
                                           placeholder="请填写登录密码.."
                                           class="col-xs-10 col-sm-5"/>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3 control-label no-padding-right" for="loginPwdConfirm">
                                    确认密码
                                </label>
                                <div class="col-sm-9">
                                    <input type="password" id="loginPwdConfirm" name="loginPwdConfirm"
                                           placeholder="请填写确认密码.."
                                           class="col-xs-10 col-sm-5"/>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button class="btn btn-info" type="button" id="restPwd">
                    <i class="icon-ok bigger-110"></i>
                    确认
                </button>
                <button class="btn" type="button" id="cancel-restpwd">
                    <i class="icon-undo bigger-110"></i>
                    重置
                </button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

<script>
    $('#restPwd').click(function () {
        $('#user-restpwd-form').submit();
    });

    //验证不能有中文
    jQuery.validator.addMethod("checkHasCHN", function (value, element) {
        var reg = /[\u4E00-\u9FA5]/g;
        if (reg.test(value)) {
            return false;
        } else {
            return true;
        }
    }, "不能包含中文字符");


    var rest_pwd_validator = $('#user-restpwd-form').validate({
        // 错误展示位置
        errorPlacement: function (error, element) {
            $(element).parent().append(error);
        },
        errorElement: 'label',
        errorClass: 'help-inline',
        focusInvalid: true,
        onfocusout: false,
        rules: {
            loginPwd: {
                required: true,
                checkHasCHN: true,
                minlength: 6,
            },
            loginPwdConfirm: {
                required: true,
                checkHasCHN: true,
                minlength: 6,
                equalTo: '#loginPwd',
            },
        },
        messages: {
            loginPwd: {
                required: '请填写密码.',
                minlength: "密码最少6位"
            },
            loginPwdConfirm: {
                required: '请确认密码.',
                equalTo: "两次密码不一致",
                minlength: "密码最少6位"
            }
        },
        invalidHandler: function (event, validator) { //display error alert on form submit
            $('.alert-danger', $('#validation-form')).show();
        },
        highlight: function (e) {
            $(e).closest('.form-group').removeClass('has-info').addClass('has-error');
        },
        success: function (e) {
            $(e).closest('.form-group').removeClass('has-error').addClass('has-info');
            $(e).remove();
        },
        errorPlacement: function (error, element) {
            error.insertAfter(element);
        },
        submitHandler: function (form) {
            //进行ajax传值
            $.ajax({
                url: "sys/user/doRestPwd.do",
                type: "post",
                dataType: "json",
                data: {
                    'id': $('#id').val(),
                    'pwd': $('#loginPwd').val()
                },
                success: function (msg) {
                    //要执行的代码
                    if (!msg.success) {
                        layer.msg(msg.msg);
                        return;
                    }
                    window.location.href = "login.htm";
                }
            });
            return false;
        }
    });

    $("#cancel-restpwd").click(function (e) {
        $('.form-group').removeClass('has-error');
        $('.form-group').removeClass('has-info');
        rest_pwd_validator.resetForm();
        $('#user-restpwd-form')[0].reset();
    });

    $("#usePwdModal").on("hidden.bs.modal", function () {
        $(this).removeData("bs.modal");
    });
</script>
